<!--
单文件组件 
https://cn.vuejs.org/v2/guide/single-file-components.html#%E9%92%88%E5%AF%B9%E9%AB%98%E7%BA%A7%E7%94%A8%E6%88%B7
-->
<template>
  <div>
    <h2>{{message}}</h2>
    <button @click="btnClick">按钮</button>
    <h2>{{name}}</h2>
    <hr />
    <Cpn></Cpn>
  </div>
</template>


<script>

  import Cpn from './Cpn'

  export default {
    name: 'App',
    data() {
      return {
        message: 'hello webpack',
        name: 'srx'
      }
    },
    methods: {
      btnClick() {
        console.log('按钮被点击了')
      }
    },
    components: {
      Cpn
    }
  }
</script>


<style scoped>
  .title {
    color: green;
  }
</style>